import { Form, Button } from '@douyinfe/semi-ui';

function BaseSetting() {
  const initValues = {
    user_name: '勇敢牛牛',
    phone_number: '2333',
    group: 'group_two',
    role: 'user',
    sex: '2'
  }
  return (
    <div>
      <Form
        labelPosition="left"
        labelWidth="120px"
        labelAlign="left"
        initValues={initValues}
        style={{ padding: '10px', width: 600 }}>
          <Form.Input
            field="user_name"
            label="用户名"
            trigger='blur'
            style={{width: 200}}
          />
          <Form.Input
            field="password"
            label="密码"
            trigger='blur'
            style={{width: 200}}
          />
          <Form.Input
            field="phone_number"
            label="手机号码"
            trigger='blur'
            style={{width: 200}}
          />
          <Form.Select label="分组" field='group' style={{width: 200}}>
            <Form.Select.Option value="group_one">一组</Form.Select.Option>
            <Form.Select.Option value="group_two">二组</Form.Select.Option>
            <Form.Select.Option value="group_three">三组</Form.Select.Option>
          </Form.Select>
          <Form.Select label="角色" field='role' style={{width: 200}}>
            <Form.Select.Option value="admin">管理员</Form.Select.Option>
            <Form.Select.Option value="user">普通用户</Form.Select.Option>
          </Form.Select>
          <Form.Select label="性别" field='sex' style={{width: 200}}>
            <Form.Select.Option value="1">男</Form.Select.Option>
            <Form.Select.Option value="2">女</Form.Select.Option>
          </Form.Select>
          <Button type="primary" theme="solid" htmlType="submit">保存</Button>
      </Form>
    </div>
  )
}

export default BaseSetting;